<template>
	<view class="uni-tab-bar">
		<view class="uni-flex uni-column" style="flex: 1;">
			<view class="head-padding">
				<view class="uni-flex uni-flex-item" style="padding-top: 20upx; ">
					<view>
						<image :src="userInfo.avatarUrl" style="border-radius:100upx; height: 120upx;width: 120upx; "></image>
					</view>
					<view class="" style="font-size: 60upx; padding-left: 30upx;">
						{{userInfo.nickName}} <uni-icon type="arrowright" size="30" color="#2222"></uni-icon>
					</view>
				</view>
			</view>
		</view>
		<view style="flex:6">
			<view>
				<uni-list>
					<uni-list-item title="我的订单" :show-extra-icon="true" :extra-icon="extraIcon1" :show-badge="true" badge-text="12"></uni-list-item>
					<uni-list-item title="账单明细" thumb="https://img-cdn-qiniu.dcloud.net.cn/new-page/hx.png"></uni-list-item>
					<uni-list-item title="收获地址" thumb="https://img-cdn-qiniu.dcloud.net.cn/new-page/hx.png"></uni-list-item>
				</uni-list>
			</view>
			<view class="mt50">
				<uni-list>
					<uni-list-item title="帮助中心" :show-extra-icon="true" :extra-icon="extraIcon1" :show-badge="true" :badge-text="'12'"></uni-list-item>
					<uni-list-item title="意见反馈" thumb="https://img-cdn-qiniu.dcloud.net.cn/new-page/hx.png"></uni-list-item>
				</uni-list>
			</view>
			<view class="mt50">
				<uni-list>
					<uni-list-item title="关于我们" :show-extra-icon="true" :extra-icon="extraIcon1" :show-badge="true" :badge-text="'12'"></uni-list-item>
					<uni-list-item title="系统设置" thumb="https://img-cdn-qiniu.dcloud.net.cn/new-page/hx.png"></uni-list-item>
				</uni-list>
			</view>
		</view>
	</view>
</template>

<script>
	let _self;
	import uniIcon from "@/components/uni-icon/uni-icon.vue";
	import uniList from '@/components/uni-list/uni-list.vue';
	import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
	export default {
		components:{
			uniIcon,
			uniList,
			uniListItem
		},
		data() {
			return {
				title: "my...",
				userInfo: {}
			}
		},
		onLoad() {
			_self = this;
			uni.getUserInfo({
				success(e) {
					console.log(e.userInfo)
					_self.userInfo = e.userInfo;
				}
			})
		},
		methods: {

		}
	}
</script>

<style>
	.nickname {
		font-size: 16px;
	}

	.head-padding {
		padding: 0upx 30upx;
	}
	.mt50{
		margin-top: 50upx;
	}
</style>
